<!DOCTYPE html>
<html lang="zh-cmn-Hans">
<head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0, user-scalable=no">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="renderer" content="webkit">
    <meta http-equiv="Cache-Control" content="no-siteapp">
  
    <link rel="manifest" href="http://chat.henrize.kim:3000/manifest.json">
<!--
    <link rel="stylesheet" href="files/style.css">
    <link id="scheme-link" rel="stylesheet" href="files/a.css">
-->

    <link rel="stylesheet" href="files/katex.css">
<!--    <script src="files/hm.js"></script><script src="files/katex.js"></script>-->
    <script src="files/remarkableKatex.js"></script>

    <script src="files/highlight.js"></script>
    <link id="highlight-link" rel="stylesheet" href="files/hybrid.css">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/remarkable/2.0.0/remarkable.min.js"></script>
    <script src="http://chat.henrize.kim:3000/vendor/remarkable/remarkable.min.js"></script>
  
    <title>Henrize 聊天室</title>
<!--    <link rel="stylesheet" href="mdui/css/mdui.css">-->
    <link rel="stylesheet" href="//cdnjs.loli.net/ajax/libs/mdui/0.4.3/css/mdui.min.css">
    <script>
        window.dataLayer = window.dataLayer || [];
        function gtag(){dataLayer.push(arguments);}
        gtag('js', new Date());

        gtag('config', 'UA-88818678-1');
    </script>

<!--
    <script>
        var _hmt = _hmt || [];
        (function() {
          var hm = document.createElement("script");
          hm.src = "https://hm.baidu.com/hm.js?a9259cf9514395ebcad803f195ef0997";
          var s = document.getElementsByTagName("script")[0]; 
          s.parentNode.insertBefore(hm, s);
        })();
    </script>
-->
    <style type="text/css">
    .round_icon{
      width: 34px;
      height: 34px;
      display: flex;
      border-radius: 50%;
      align-items: center;
      justify-content: center;
      overflow: hidden;
    }
    </style>
</head>
<body class="mdui-drawer-body-left mdui-appbar-with-toolbar mdui-loaded mdui-theme-primary-indigo mdui-theme-accent-pink">
<header class="mdui-appbar mdui-appbar-fixed">
  <div class="mdui-toolbar mdui-color-theme">
    <span class="mdui-btn mdui-btn-icon mdui-ripple mdui-ripple-white"
      mdui-drawer="{target: '#main-drawer', swipe: true}"><i class="mdui-icon material-icons">menu</i></span>
<!--    <a href="/" class="mdui-typo-headline mdui-hidden-xs">Henrize 聊天室</a>-->
    <div class="mdui-tab mdui-tab-full-width" mdui-tab id="chat-windows">
      <a href="#example2-tab1" class="mdui-ripple">web</a>
    </div>
    <div class="mdui-toolbar-spacer"></div>
    <button class="mdui-btn mdui-btn-icon" mdui-dialog="{target: '#chat-new-room'}"><i class="mdui-icon material-icons">import_export</i></button>
    <button class="mdui-btn mdui-btn-icon" mdui-menu="{target: '#chat-more_vert'}"><i class="mdui-icon material-icons">more_vert</i></button>
    <ul class="mdui-menu" id="chat-more_vert">
      <li class="mdui-menu-item">
        <a href="javascript:;" mdui-dialog="{target: '#chat-new-room'}" class="mdui-ripple">新窗口</a>
      </li>
      <li class="mdui-menu-item">
        <a href="javascript:;" class="mdui-ripple">关闭当前窗口</a>
      </li>
      <li class="mdui-divider"></li>
      <li class="mdui-menu-item">
        <a href="javascript:;" onclick="new mdui.Dialog($('#chat-dialog-sidebar')).open();" class="mdui-ripple">设置</a>
      </li>
      <li class="mdui-menu-item">
        <a href="javascript:;" mdui-dialog="{target: '#dialog-docs-theme'}" class="mdui-ripple">设置主题</a>
      </li>
      <li class="mdui-divider"></li>
      <li class="mdui-menu-item">
        <a href="https://sm.ms/" target="_blank" class="mdui-ripple">图床</a>
      </li>
      <li class="mdui-divider"></li>
      <li class="mdui-menu-item">
        <a href="javascript:;" mdui-dialog="{target: '#chat-dialog-about'}" class="mdui-ripple">关于</a>
      </li>
      <li class="mdui-divider"></li>
      <li class="mdui-menu-item">
        <a href="" class="mdui-ripple">登出/刷新</a>
      </li>
      <li class="mdui-menu-item">
        <a href="javascript:;" onclick="window.location.href = window.location.href.slice(0, window.location.href.indexOf('?'))" class="mdui-ripple">回到首页</a>
      </li>
    </ul>
  </div>
  <div class="mdui-progress" id="wenku8-progress" style="display: none;">
      <div class="mdui-progress-indeterminate"></div>
  </div>
</header>

<div class="mdui-drawer" id="main-drawer">
    <div class="mdui-list" mdui-collapse="{accordion: true}" style="margin-bottom: 76px;">
        <div class="mdui-collapse-item">
            <div class="mdui-collapse-item-header mdui-list-item mdui-ripple">
                <i class="mdui-list-item-icon mdui-icon material-icons mdui-text-color">near_me</i>
                <div class="mdui-list-item-content">关于</div>
                <i class="mdui-collapse-item-arrow mdui-icon material-icons">keyboard_arrow_down</i>
            </div>
            <div class="mdui-collapse-item-body mdui-list">
                <a href="https://github.com/LanceLiang2018"
                   class="mdui-list-item mdui-ripple">关于:前端界面·改</a>
            </div>
        </div>
    </div>
</div>


<!--    这里是承载的内容-->
<div class="mdui-container doc-container doc-no-cover">
    <div id="contain-dist mdui-typo">
      <audio style="display: none" id="notify-sound" preload="auto" src="http://chat.henrize.kim:3000/audio/notify.mp3">
        <source src="http://chat.henrize.kim:3000/audio/notify.mp3" type="audio/ogg">
      </audio>
      <article class="container mdui-typo">
        <div id="messages" class="messages">
        </div>
      </article>
    </div>
</div>

<div class="mdui-dialog" id="chat-dialog-agreement">
  <div class="mdui-dialog-title">Henrize聊天室服务协议</div>
  <div class="mdui-dialog-content mdui-typo">
    <p>一、Henrize聊天室服务协议（以下简称“本协议”）是您与Henrize聊天室（以下简称“本聊天室”）在您使用聊天室时所订下的协议。</p>
    <p>二、聊天室运营和开发团队（以下简称“我们”）将使用包括但不限于网页浏览器软件、包含网页浏览器的软件、聊天室提供的API、有关软件访问本聊天室的服务器并进行加入聊天室、浏览、发布消息或接收消息等操作视为使用聊天室的服务（以下简称“本服务”）。</p>
    <p>三、在您使用本服务时，我们有义务为您提供域名购买和解析、软件开发、消息转发等服务。但是我们不保证我们的服务稳定且符合您的期望，同时我们不该为任何原因所造成的意外和服务终止负责。</p>
    <p>四、在使用本聊天室的服务前，您应该首先完全阅读、完全理解、完全同意并完全遵守本协议和相关法律。如果您不在中国大陆范围内居住，您还应当同时遵守当地的法律规定。</p>
    <p>五、本聊天室会在服务器依法保存您的IP地址、设备信息、访问记录和聊天记录，本聊天室保证不会在您不违法的情况下将保存的数据向第三方（公安部门等有关司法部门除外）进行披露和分享。</p>
    <p><strong>六、您不得将本聊天室用于非法用途，一旦您在本网站进行了任何违反中华人民共和国法律的行为，本网站有权永久拒绝您的访问。</strong></p>
    <p>七、聊天室提倡友好愉快地交流。我们将包括但不限于恶意攻击他人、事物或组织、恶意在短时间内发送大量无意义的包括但不限于文字信息或图片信息、发送令大多数人厌恶或产生不适的包括但不限于文字信息或图片信息、恶意宣传个人、事物或组织视为“发送不友好的消息”的行为。对于以上行为，我们有权加以警告和封禁。</p>
    <p>八、您不得将本聊天室用于商业用途，一旦您在本网站进行了任何商业性行为，本网站有权永久拒绝您的访问。</p>
    <p>九、本聊天室有权在必要时修改本协议条款。您可以在相关页面中查阅最新的协议条款。本协议条款变更后，如果您继续使用本服务，即视为您已接受修改后的协议。如果您不接受修改后的协议，应当停止使用本服务。</p>
    <p>十、有关本网站的源码和文字版权问题，请参见版权页。</p>
    <p>上述内容可能有所变更，请参照最新<a href='http://chat.henrize.kim:3000/agreement.html'>服务协议</a>。</p>
    <hr/>
    <p>Henrize Chat Dev Team</p>
    <p>2020/03/03</p>
  </div>
</div>

<div class="mdui-dialog" id="chat-dialog-about">
  <div class="mdui-dialog-title">关于</div>
  <div class="mdui-dialog-content">
      <ul class="mdui-list">
        <li class="mdui-list-item mdui-ripple"><a href="http://chat.henrize.kim:3000/copyright.html">STAFF</a></li>
        <li class="mdui-list-item mdui-ripple" mdui-dialog="{target: '#chat-dialog-agreement'}" onclick="history.go(-1);">服务协议</li>
        <li class="mdui-list-item mdui-ripple"><a href="mailto://mail@to.henrize.kim/">联系站长</a></li>
      </ul>
  </div>
</div>

  <div class="mdui-dialog" id="chat-new-room">
  <div class="mdui-dialog-title">进入新的房间</div>
  <div class="mdui-dialog-content">
    <div class="mdui-textfield mdui-textfield-floating-label">
      <label class="mdui-textfield-label">房间叫什么呢</label>
      <input class="mdui-textfield-input" type="email" value="lounge" id="chat-new-room">
    </div>
  </div>
  <div class="mdui-dialog-actions">
    <button class="mdui-btn mdui-ripple" onclick="history.go(-1);">cancel</button>
    <button class="mdui-btn mdui-ripple" onclick="openNewRoom()">ok</button>
  </div>
</div>

<div class="mdui-dialog" id="chat-dialog-sidebar">
    <div class="mdui-dialog-title">功能设置</div>
    <div class="mdui-dialog-content mdui-typo">
      <div id="chat-sidebar-content">
        <h3><a href="/">Henrize的聊天室</a></h3>
        <p>使用hack.chat的源代码搭建</p>
        <p>由HCDT提供服务和翻译</p>
        <p>邮箱：<a href="mailto://mail@to.henrize.kim/">mail@to.henrize.kim</a></p>
        <hr>
        <h4>设置</h4>
        <p>
<!--          <input id="pin-sidebar" type="checkbox">-->
<!--          <label for="pin-sidebar">固定侧边栏</label>-->
<!--
          <label class="mdui-checkbox" id="pin-sidebar">
            <input type="checkbox"/>
              <i class="mdui-checkbox-icon"></i>
              固定侧边栏
          </label>
-->
        </p>
        <p>
<!--          <input id="sound-switch" type="checkbox">-->
<!--          <label for="sound-switch">有人@我时播放提示音</label>-->
          <label class="mdui-checkbox">
            <input type="checkbox" id="sound-switch"/>
              <i class="mdui-checkbox-icon"></i>
              有人@我时播放提示音
          </label>
        </p>
        <p>
<!--          <input id="notify-switch" type="checkbox">-->
<!--          <label for="notify-switch">有人@我时浏览器提示</label>-->
          <label class="mdui-checkbox">
            <input type="checkbox" id="notify-switch"/>
              <i class="mdui-checkbox-icon"></i>
              有人@我时浏览器提示
          </label>
        </p>
        <p>
<!--          <input id="joined-left" type="checkbox" checked="checked">-->
<!--          <label for="joined-left">用户加入和退出提醒</label>-->
          <label class="mdui-checkbox">
            <input type="checkbox" checked="" id="joined-left"/>
              <i class="mdui-checkbox-icon"></i>
              用户加入和退出提醒
          </label>
        </p>
        <p>
<!--          <input id="parse-latex" type="checkbox" checked="checked">-->
<!--          <label for="parse-latex">启用LaTeX</label>-->
          <label class="mdui-checkbox">
            <input type="checkbox" checked="" id="parse-latex"/>
              <i class="mdui-checkbox-icon"></i>
              启用LaTeX
          </label>
        </p>
        <p>
<!--          <input id="syntax-highlight" type="checkbox" checked="checked">-->
<!--          <label for="syntax-highlight">启用高光</label>-->
          <label class="mdui-checkbox">
            <input type="checkbox" checked="" id="syntax-highlight"/>
              <i class="mdui-checkbox-icon"></i>
              启用高光
          </label>
        </p>
        <p>
<!--          <input id="allow-imgur" type="checkbox" checked="checked">-->
<!--          <label for="allow-imgur" title="">查看图片消息</label>-->
          <label class="mdui-checkbox">
            <input type="checkbox" checked="" id="allow-imgur"/>
              <i class="mdui-checkbox-icon"></i>
              查看图片消息
          </label>
        </p>
        <p>
<!--        </p><h4>选择站点配色</h4>-->
          <select id="scheme-selector" style="display: none"><option value="安卓黑">安卓黑</option><option value="默认黑">默认黑</option><option value="夜空黑">夜空黑</option><option value="终端黑">终端黑</option><option value="初恋粉">初恋粉</option><option value="安卓白">安卓白</option><option value="粉笔白">粉笔白</option><option value="石灰白">石灰白</option><option value="寒夜蓝">寒夜蓝</option><option value="口罩蓝">口罩蓝</option><option value="流行蓝">流行蓝</option><option value="天依蓝">天依蓝</option><option value="油漆蓝">油漆蓝</option><option value="荒漠黄">荒漠黄</option><option value="代码灰">代码灰</option><option value="球场绿">球场绿</option><option value="荧光绿">荧光绿</option><option value="芬达橙">芬达橙</option><option value="匿名版">匿名版</option></select>
        <p></p>
        <p>
          </p><h4>代码高光样式</h4>
          <select id="highlight-selector" class="mdui-select" mdui-select><option value="agate">agate</option><option value="androidstudio">androidstudio</option><option value="atom-one-dark">atom-one-dark</option><option value="darcula" selected="selected">darcula</option><option value="github">github</option><option value="rainbow">rainbow</option><option value="tomorrow">tomorrow</option><option value="xcode">xcode</option><option value="zenburn">zenburn</option></select>
        <p></p>
        <p>
          <button class="mdui-btn mdui-btn-raised mdui-ripple mdui-color-theme-accent" id="clear-messages">清空本页聊天记录</button>
        </p>
        <hr>
        <h4>在线的用户</h4>
        <p>（你可以点击下面的用户名邀请该用户到一个随机生成聊天室）</p>
        <ul id="users" class="mdui-list"></ul>
      </div>
    </div>
</div>
  
<div class="mdui-dialog mdui-dialog-open" id="dialog-docs-theme">
  <div class="mdui-dialog-title">设置主题颜色</div>
  <div class="mdui-dialog-content" style="height: 186px;">

    <p class="mdui-typo-title">主题色</p>
    <div class="mdui-row-xs-1 mdui-row-sm-2 mdui-row-md-3">
      <div class="mdui-col">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-layout" value="" checked="">
          <i class="mdui-radio-icon"></i>
          Light
        </label>
      </div>
      <div class="mdui-col">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-layout" value="dark">
          <i class="mdui-radio-icon"></i>
          Dark
        </label>
      </div>
    </div>

    <p class="mdui-typo-title mdui-text-color-theme">主色</p>
    <form class="mdui-row-xs-1 mdui-row-sm-2 mdui-row-md-3">
      <div class="mdui-col mdui-text-color-amber">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-primary" value="amber">
          <i class="mdui-radio-icon"></i>
          Amber
        </label>
      </div>
      <div class="mdui-col mdui-text-color-blue">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-primary" value="blue">
          <i class="mdui-radio-icon"></i>
          Blue
        </label>
      </div>
      <div class="mdui-col mdui-text-color-blue-grey">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-primary" value="blue-grey">
          <i class="mdui-radio-icon"></i>
          Blue Grey
        </label>
      </div>
      <div class="mdui-col mdui-text-color-brown">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-primary" value="brown">
          <i class="mdui-radio-icon"></i>
          Brown
        </label>
      </div>
      <div class="mdui-col mdui-text-color-cyan">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-primary" value="cyan">
          <i class="mdui-radio-icon"></i>
          Cyan
        </label>
      </div>
      <div class="mdui-col mdui-text-color-deep-orange">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-primary" value="deep-orange">
          <i class="mdui-radio-icon"></i>
          Deep Orange
        </label>
      </div>
      <div class="mdui-col mdui-text-color-deep-purple">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-primary" value="deep-purple">
          <i class="mdui-radio-icon"></i>
          Deep Purple
        </label>
      </div>
      <div class="mdui-col mdui-text-color-green">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-primary" value="green">
          <i class="mdui-radio-icon"></i>
          Green
        </label>
      </div>
      <div class="mdui-col mdui-text-color-grey">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-primary" value="grey">
          <i class="mdui-radio-icon"></i>
          Grey
        </label>
      </div>
      <div class="mdui-col mdui-text-color-indigo">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-primary" value="indigo" checked="">
          <i class="mdui-radio-icon"></i>
          Indigo
        </label>
      </div>
      <div class="mdui-col mdui-text-color-light-blue">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-primary" value="light-blue">
          <i class="mdui-radio-icon"></i>
          Light Blue
        </label>
      </div>
      <div class="mdui-col mdui-text-color-light-green">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-primary" value="light-green">
          <i class="mdui-radio-icon"></i>
          Light Green
        </label>
      </div>
      <div class="mdui-col mdui-text-color-lime">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-primary" value="lime">
          <i class="mdui-radio-icon"></i>
          Lime
        </label>
      </div>
      <div class="mdui-col mdui-text-color-orange">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-primary" value="orange">
          <i class="mdui-radio-icon"></i>
          Orange
        </label>
      </div>
      <div class="mdui-col mdui-text-color-pink">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-primary" value="pink">
          <i class="mdui-radio-icon"></i>
          Pink
        </label>
      </div>
      <div class="mdui-col mdui-text-color-purple">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-primary" value="purple">
          <i class="mdui-radio-icon"></i>
          Purple
        </label>
      </div>
      <div class="mdui-col mdui-text-color-red">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-primary" value="red">
          <i class="mdui-radio-icon"></i>
          Red
        </label>
      </div>
      <div class="mdui-col mdui-text-color-teal">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-primary" value="teal">
          <i class="mdui-radio-icon"></i>
          Teal
        </label>
      </div>
      <div class="mdui-col mdui-text-color-yellow">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-primary" value="yellow">
          <i class="mdui-radio-icon"></i>
          Yellow
        </label>
      </div>
    </form>

    <p class="mdui-typo-title mdui-text-color-theme-accent">强调色</p>
    <form class="mdui-row-xs-1 mdui-row-sm-2 mdui-row-md-3">
      <div class="mdui-col mdui-text-color-amber">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-accent" value="amber">
          <i class="mdui-radio-icon"></i>
          Amber
        </label>
      </div>
      <div class="mdui-col mdui-text-color-blue">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-accent" value="blue">
          <i class="mdui-radio-icon"></i>
          Blue
        </label>
      </div>
      <div class="mdui-col mdui-text-color-cyan">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-accent" value="cyan">
          <i class="mdui-radio-icon"></i>
          Cyan
        </label>
      </div>
      <div class="mdui-col mdui-text-color-deep-orange">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-accent" value="deep-orange">
          <i class="mdui-radio-icon"></i>
          Deep Orange
        </label>
      </div>
      <div class="mdui-col mdui-text-color-deep-purple">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-accent" value="deep-purple">
          <i class="mdui-radio-icon"></i>
          Deep Purple
        </label>
      </div>
      <div class="mdui-col mdui-text-color-green">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-accent" value="green">
          <i class="mdui-radio-icon"></i>
          Green
        </label>
      </div>
      <div class="mdui-col mdui-text-color-indigo">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-accent" value="indigo">
          <i class="mdui-radio-icon"></i>
          Indigo
        </label>
      </div>
      <div class="mdui-col mdui-text-color-light-blue">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-accent" value="light-blue">
          <i class="mdui-radio-icon"></i>
          Light Blue
        </label>
      </div>
      <div class="mdui-col mdui-text-color-light-green">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-accent" value="light-green">
          <i class="mdui-radio-icon"></i>
          Light Green
        </label>
      </div>
      <div class="mdui-col mdui-text-color-lime">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-accent" value="lime">
          <i class="mdui-radio-icon"></i>
          Lime
        </label>
      </div>
      <div class="mdui-col mdui-text-color-orange">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-accent" value="orange">
          <i class="mdui-radio-icon"></i>
          Orange
        </label>
      </div>
      <div class="mdui-col mdui-text-color-pink">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-accent" value="pink" checked="">
          <i class="mdui-radio-icon"></i>
          Pink
        </label>
      </div>
      <div class="mdui-col mdui-text-color-purple">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-accent" value="purple">
          <i class="mdui-radio-icon"></i>
          Purple
        </label>
      </div>
      <div class="mdui-col mdui-text-color-red">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-accent" value="red">
          <i class="mdui-radio-icon"></i>
          Red
        </label>
      </div>
      <div class="mdui-col mdui-text-color-teal">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-accent" value="teal">
          <i class="mdui-radio-icon"></i>
          Teal
        </label>
      </div>
      <div class="mdui-col mdui-text-color-yellow">
        <label class="mdui-radio mdui-m-b-1">
          <input type="radio" name="doc-theme-accent" value="yellow">
          <i class="mdui-radio-icon"></i>
          Yellow
        </label>
      </div>
    </form>

  </div>
  <div class="mdui-divider"></div>
  <div class="mdui-dialog-actions">
    <button class="mdui-btn mdui-ripple mdui-float-left" mdui-dialog-cancel="">恢复默认主题</button>
    <button class="mdui-btn mdui-ripple" mdui-dialog-confirm="">ok</button>
  </div>
</div>
  
<footer id="footer" style="position: fixed; bottom: 0; width: 100%">
  <div class="container">
    <form id="chatform" class="message">
      <div class="mdui-textfield">
        <textarea id="chatinput" class="mdui-textfield-input" type="text" placeholder="Message" autocomplete="off" autofocus=""></textarea>
      </div>
    </form>
  </div>
</footer>

<!--<script src="files/jquery.min.js"></script>-->
<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<!--    <script src="https://cdn-1254016670.cos-website.ap-chengdu.myqcloud.com/using/showdown.min.js"></script>-->
<!--    <script src="https://cdn-1254016670.cos-website.ap-chengdu.myqcloud.com/using/cos-js-sdk-v5.js"></script>-->
<!--<script src="mdui/js/mdui.min.js"></script>-->
<script src="//cdnjs.loli.net/ajax/libs/mdui/0.4.3/js/mdui.min.js"></script>
<script>var $$ = mdui.JQ;</script>
<script>var $_ = $</script>
<script src="files/client.js"></script>
<script type="application/javascript">
  function openNewRoom() {
    
  }
</script>
</body>
</html>